{% extends "base-layout.html" %}
{% block head_title %}
    {{ super() }}
{% endblock %}
{% block head_seo %}
    {{ super() }}
{% endblock %}
{% block head_link %}
    {{ super() }}
    <link href="/static/css/top-nav.css" rel="stylesheet" type="text/css" />
{% endblock %}
{% block head_css %}
    {{ super() }}
{% endblock %}
{% block head_js %}
    {{ super() }}
{% endblock %}
{% block body_header %}
    {{ super() }}
    {% include "widgets/top-nav.html" ignore missing with context %}
{% endblock %}
{% block body_main %}
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-12 col-sm-8 col-md-9 col-lg-9">
                ['title', 'id', 'create_time', 'markdown', 'tags', 'html', 'category', 'sketch']
                <div class="blog-title">
                    <h2>{{ blog_item.title }}</h2>
                </div>
                <div class="blog-content">
                    {{ blog_item.html | safe }}
                </div>
            </div>
            <div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">
                right panel
            </div>
        </div>
    </div>
{% endblock %}
{% block body_js %}
    {{ super() }}
    <script type="text/javascript">
        function highlightCurrent() {
            var $current_bar = $('#navbar').find('li[data-bar="' + GLOBAL.CURRENT + '"]');
            if($current_bar.length > 0) {
                if(!$current_bar.hasClass('nav-current')) {
                    $current_bar.addClass('nav-current');
                }
            }
        }

        $(document).ready(function() {
            ;
            // highlightCurrent();
        });
    </script>
{% endblock %}